import React from "react";
import styles from "./postCard.module.css";
import Image from "next/image";
import Link from "next/link";
const PostCard = ({ post }) => {
  return (
    <div className={styles.container}>
      <div className={styles.top}>
        <div className={styles.imgContainer}>
          {post.img?.startsWith("https") ? (
            <Image className={styles.img} alt="post" src={post.img} fill />
          ) : (
            <Image className={styles.img} alt="post" src="/about.png" fill />
          )}
        </div>
        <span className={styles.date}>2020.01.01</span>
      </div>
      <div className={styles.bottom}>
        <div className={styles.title}>{post.title}</div>
        <div className={styles.desc}>{post.body}</div>
        <Link href={`/blog/${post._id}`}>read more</Link>
      </div>
    </div>
  );
};

export default PostCard;
